<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="initial-scale=1.0" />
  <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
  <title>自动转入</title>
  <link rel="stylesheet" href="../../css/reset.css" />
  <style>
    body {
      width: 100%;
      background-color: #fff;
      font-size: 0.25rem;
      height: auto;
      -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
      font-family: Helvetica;
      color: rgba(24, 24, 24, 0.65);
    }

    .testFix {
      width: 100%;
      /*height: 1.32rem;*/
      position: fixed;
      top: 0;
      left: 0;
    }

    .head {
      width: 100%;
      height: 44px;
      background-color: #ffffff;
      display: flex;
      display: -webkit-flex;
      justify-content: space-between;
      -webkit-justify-content: space-between;
      align-items: center;
      -webkit-align-items: center;
      box-sizing: border-box;
      border-bottom: 1px solid #e2e2e2;
      padding: 0 0.26rem;
    }

    .head img {
      width: 0.21rem;
      height: 0.36rem;
    }

    .head_title {
      font-size: 0.35rem;
      color: #333333;
      -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    }

    .nowNumber {
      padding: 0 0 0 0.24rem;
      box-sizing: border-box;
      display: flex;
      display: -webkit-flex;
      flex-direction: column;
      border-top: 0.2rem solid #f7f7f7;
    }

    .showli {
      width: 100%;
      height: 0.8rem;
      padding-right: 0.24rem;
      box-sizing: border-box;
      display: flex;
      display: -webkit-flex;
      justify-content: space-between;
      -webkit-justify-content: space-between;
      align-items: center;
      -webkit-align-items: center;
      border-bottom: 1px solid #e5e4e5;
    }

    .showliblance {
      width: 100%;
      height: 0.8rem;
      padding-right: 0.24rem;
      box-sizing: border-box;
      display: flex;
      display: -webkit-flex;
      justify-content: space-between;
      -webkit-justify-content: space-between;
      align-items: center;
      -webkit-align-items: center;
    }

    #keepBiance {
      display: inline-block;
      width: 100%;
      font-size: 0.26rem;
      padding-left: 0.1rem;
      outline: none;
      border: none;
      height: 0.64rem;
    }

    .tips {
      background-color: #f7f7f7;
      padding: 0 0.24rem;
      height: 0.8rem;
      color: #828282;
      box-sizing: border-box;
      display: flex;
      display: -webkit-flex;
      flex-direction: column;
      justify-content: center;
    }

    .aui-switch {
      width: 1rem;
      height: 0.54rem;
      position: relative;
      vertical-align: top;
      border: 1px solid #dddddd;
      background-color: #dddddd;
      border-radius: 0.54rem;
      background-clip: content-box;
      display: inline-block;
      outline: none;
      -webkit-appearance: none;
      appearance: none;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      -webkit-background-clip: padding-box;
      background-clip: padding-box;
      -webkit-transition: all 0.2s linear;
      transition: all 0.2s linear;
    }

    .aui-switch:before {
      width: 0.53rem;
      height: 0.53rem;
      position: absolute;
      top: -0.01rem;
      left: -0.02rem;
      border-radius: 0.5rem;
      background-color: #fff;
      content: "";
      -webkit-transition: left 0.2s;
      transition: left 0.2s;
    }

    .aui-switch:checked {
      border-color: #ffd203;
      background-color: #ffd203;
    }

    .aui-switch:checked:before {
      left: 0.42rem;
    }

    .checkname {
      padding: 0 0 0 0.24rem;
      box-sizing: border-box;
      display: flex;
      display: -webkit-flex;
      flex-direction: column;
      border-top: 0.2rem solid #f7f7f7;
    }

    .showname {
      width: 100%;
      height: 0.8rem;
      padding-right: 0.24rem;
      box-sizing: border-box;
      display: flex;
      display: -webkit-flex;
      justify-content: space-between;
      -webkit-justify-content: space-between;
      align-items: center;
      -webkit-align-items: center;
      border-bottom: 1px solid #e5e4e5;
    }

    .showreg {
      display: flex;
      display: -webkit-flex;
      align-items: center;
      -webkit-align-items: center;
    }
  </style>
</head>

<body>
  <div class="nowNumber">
    <p class="showli">
      <span> 显示手势轨迹 </span>
      <span>
        <input type="checkbox" class="aui-switch" id="chooseNewRuler" data-flag="false" />
      </span>
    </p>
    <p class="showliblance">
      <span> 修改手势密码 </span>
      <span>
        <!-- <span class="user-name"></span> -->
        <img src="../../image/right_jintouax.png" alt="" style=" width: 0.12rem;height: 0.22rem;" />
      </span>
    </p>
  </div>
  <script src="../../script/autosize.js"></script>
  <script src="../../script/fastclick.js"></script>
  <script src="../../script/jquery_three_two_one.js"></script>
  <script src="../../script/app.js"></script>
  <script>
    apiready = function () {
      var app = new APP();
      app.handlePage();
      //获取用户信息
      var account = app.getAccount();
      // 获取用户设置
      var accountSet = app.getAccountSet();
      $("input").click(function () {
        $(this)
          .focus()
          .select(); //保险起见，还是加上这句。
      });
      if (accountSet.openHandPassLine == true) {
        $("input[type='checkbox']").attr("checked", "checked");
      } else {
        $("input[type='checkbox']").removeAttr("checked");
      }
      $("#chooseNewRuler").click(function (e) {
        var data = $(this).prop("checked");
        app.trigger("openHandSet");
        var accountSetNew = app.getAccountSet();
        if (data == true) {
          accountSetNew.openHandPassLine = true;
        } else {
          accountSetNew.openHandPassLine = false;
        }
        app.setAccount(accountSetNew);
      });
      $(".showliblance").on("click", function () {
        var lineColor = "#ffcf07";
        var errLineColor = "#ff3c07";
        var accountSet = app.getAccountSet();
        if (accountSet.openHandPassLine == true) {
          lineColor = "#ffcf07";
          errLineColor = "#ff3c07";
        } else {
          lineColor = "rgba(255,255,255,0)";
          errLineColor = "rgba(255,255,255,0)";
        }
        api.openWin({
          name: "checkhand",
          url: app.hd + "extrapage/checkhand.html",
          slidBackEnabled: false,
          animation: {
            type: "none"
          },
          pageParam: {
            changePassword: "true",
            lineColor: lineColor,
            errLineColor: errLineColor,
          }
        });
      });
      app.headerMap();
      app.listen("quit_login",function() {
        app.trigger("closeWinDow");
        setTimeout(function(params) {
          app.closeW();
        },1500)
      })
    };
  </script>
</body>

</html>